<template>
  <div>
    <div class="d-flex justify-content-between align-items-center">
      <h5>省农担报表</h5>
      <div v-if="isReportUser">
        <el-button type="primary" class="btn-long" @click="handleReport">报表报送</el-button>
      </div>
    </div>

    <industry-finish :report-type="6" report-name="省农担报表" ref="finishRef"></industry-finish>

    <industry-todo-dialog
      :visible.sync="todoDialogVisible"
      :report-type="6"
      :type-params="typeParams"
      :report-id="reportId"
      :report-name="reportName"
      @success="handleSuccess"
    ></industry-todo-dialog>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'

import { getCurrentDate, getCurrentReport } from '@/credit/views/city/reportCity/reportMixins'

import IndustryTodoDialog from '@/credit/views/city/reportCity/industry/TodoDialog'
import IndustryFinish from '@/credit/views/city/reportCity/industry/Finish'

export default {
  components: {
    IndustryTodoDialog,
    IndustryFinish,
  },
  props: {},
  data() {
    return {
      todoDialogVisible: false,
      typeParams: {
        'is_report_pro.eq': 0,
      },
      reportId: '',
      reportName: '省农担报表',
    }
  },
  computed: {
    ...mapGetters(['user']),
    isReportUser() {
      return +this.user.isReporter === 1
    },
  },
  watch: {},
  created() {},
  mounted() {},
  methods: {
    async handleReport() {
      this.loading = true
      const [reportId] = await this.$utils.promise(getCurrentReport(6))
      this.loading = false

      this.reportId = reportId || ''
      if (this.reportId) {
        const { year, month } = getCurrentDate()
        return this.$message.error(`${year}年${month}月${this.reportName}已报送，不能再上报！`)
      } else {
        this.todoDialogVisible = true
      }
    },

    handleSuccess() {
      this.todoDialogVisible = false
      this.$refs.finishRef.getData()
    },
  },
}
</script>

<style lang="scss" scoped></style>
